<template>
  <div class="content-wrap">
    <div class="content article">
      <header class="article-header">
        <h1 class="article-title">
          关于
        </h1>
      </header>
      <article class="article-content" v-html="about"></article>
      <p>&nbsp;</p>
    </div>
  </div>
</template>

<script>
  import {getOptionsAbout} from "../api/options";
  // 此处的highlight使用cdn引入了
  // import 'highlight.js/styles/dark.css' //样式文件
  // var hljs = require('highlight.js');
  var md = require('markdown-it')({
    highlight: function (str, lang) {
      if (lang && hljs.getLanguage(lang)) {
        try {
          return '<pre class="hljs"><code>' +
            hljs.highlight(lang, str, true).value +
            '</code></pre>';
        } catch (__) {}
      }

      return '<pre class="hljs"><code>' + md.utils.escapeHtml(str) + '</code></pre>';
    }
  });

  export default {
    name: "about",
    data() {
      return {
        about: ""
      }
    },methods: {
      getAbout() {
        getOptionsAbout().then(res => {
          this.about = md.render(res.data);
        })
      }
    },created() {
      this.getAbout()
    }
  }
</script>

<style scoped>

</style>
